import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:myfirstflutter/models/news_list_model.dart';
import 'package:myfirstflutter/utils/common_color.dart';
import 'package:myfirstflutter/utils/common_text_style.dart';

enum NewsListTaped {
  topCard,
  firstTopItem,
  secondTopItem,
  bottomCard,
  firstBottomItem,
  secondBottomItem,
  thirdBottomItem
}
typedef ItemClickedCallback = void Function(NewsListTaped type);

class NewsListWiget extends StatefulWidget {
  final ItemClickedCallback itemClicked;
  final NewsListType listType;

  NewsListWiget({
    Key key,
    @required this.itemClicked,
    @required this.listType,
  }) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return new NewsListWigetState();
  }
}

class NewsListWigetState extends State<NewsListWiget> {
  NewsListModel model = NewsListModel('--', '--', '--', '--', '--', '--', '--');

  @override
  void initState() {
    super.initState();
    /*模拟网络请求
    Future.delayed(Duration(seconds: 3), () {
      
      
    });
    */
    var newsKey = "one";
    switch (widget.listType) {
      case NewsListType.zoneNews:
        newsKey = "one";
        break;
      case NewsListType.zoneActivity:
        newsKey = "two";
        break;
      case NewsListType.zonePolicy:
        newsKey = "three";
        break;
      case NewsListType.zoneService:
        newsKey = "four";
        break;
      default:
    }

    var newsData =
        DefaultAssetBundle.of(context).loadString('test_json/test_news.json');
    newsData.then((String value) {
      if (mounted) {
        setState(() {
          Map newsMap = json.decode(value);
          model = NewsListModel.fromJson(newsMap[newsKey]);
        });
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return new ListView(
      children: <Widget>[
        GestureDetector(
          onTap: () {
            _itemClicked(NewsListTaped.topCard);
          },
          child: Container(
            margin: EdgeInsets.only(left: 12, top: 15, right: 12),
            decoration: new BoxDecoration(
              color: Colors.white,
              borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
            ),
            height: 64,
            padding: EdgeInsets.only(left: 10, right: 10),
            child: _topCard(),
          ),
        ),
        GestureDetector(
          onTap: () {
            _itemClicked(NewsListTaped.bottomCard);
          },
          child: Container(
            margin: EdgeInsets.only(left: 12, top: 15, right: 12),
            decoration: new BoxDecoration(
              color: Colors.white,
              borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
            ),
            height: 270,
            padding: EdgeInsets.only(left: 10, top: 12, right: 10),
            child: _bottomCard(),
          ),
        )
      ],
    );
  }

  Widget _topCard() {
    return new Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        Container(
            child: new Row(
          children: <Widget>[
            Text(model.topTitle,
                style: TextStyle(
                    color: textBlackColor,
                    fontSize: 14,
                    fontWeight: FontWeight.bold)),
            Container(
              margin: EdgeInsets.only(left: 10, top: 20, bottom: 20),
              width: 1,
              color: lineGrayColor,
            ),
            Container(
                margin: EdgeInsets.only(left: 15),
                height: 40,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    _topNewsItem(NewsListTaped.firstTopItem,
                        model.firstTopNews ?? '--', '2小时前'),
                    _topNewsItem(NewsListTaped.secondTopItem,
                        model.secondTopNews ?? '--', '7小时前')
                  ],
                ))
          ],
        )),
        Image.asset(
          'images/zone_right.png',
          width: 6,
          height: 12,
        )
      ],
    );
  }

  Widget _topNewsItem(NewsListTaped type, String title, String time) {
    return GestureDetector(
      onTap: () {
        _itemClicked(type);
      },
      child: Container(
        height: 20,
        child: new Wrap(
          spacing: 10,
          crossAxisAlignment: WrapCrossAlignment.center,
          children: <Widget>[
            Container(
              decoration: new BoxDecoration(
                color: Color(0xFF388AF3),
                borderRadius: new BorderRadius.all(new Radius.circular(2.0)),
              ),
              height: 4,
              width: 4,
            ),
            Text(
              title,
              style: TextStyle(fontSize: 10, color: textBlackColor),
            ),
            Text(
              time,
              style: TextStyle(fontSize: 10, color: Color(0xFF999999)),
            )
          ],
        ),
      ),
    );
  }

  Widget _bottomCard() {
    return new Column(
      children: <Widget>[
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Text(model.bottomTitle,
                style: TextStyle(
                    color: textBlackColor,
                    fontSize: 14,
                    fontWeight: FontWeight.bold)),
            Image.asset(
              'images/zone_right.png',
              width: 6,
              height: 12,
            )
          ],
        ),
        GestureDetector(
          onTap: () {
            _itemClicked(NewsListTaped.firstBottomItem);
          },
          child: Container(
            height: 100,
            margin: EdgeInsets.only(top: 15),
            decoration: BoxDecoration(
              borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
              image: DecorationImage(
                image: AssetImage("images/test.png"),
                fit: BoxFit.cover,
              ),
            ),
            child: Align(
              alignment: Alignment(-0.9, 0.9),
              child: Text(
                model.firstBottomNews,
                style: itemTextStyle,
              ),
            ),
          ),
        ),
        GestureDetector(
            onTap: () {
              _itemClicked(NewsListTaped.secondBottomItem);
            },
            child: Container(
              height: 50,
              alignment: Alignment(-0.9, -0.2),
              child: Text(model.secondBottomNews, style: itemTextStyle),
            )),
        Container(
          margin: EdgeInsets.only(left: 12, right: 12),
          height: 0.5,
          color: lineGrayColor,
        ),
        GestureDetector(
            onTap: () {
              _itemClicked(NewsListTaped.thirdBottomItem);
            },
            child: Container(
              height: 50,
              alignment: Alignment(-0.9, -0.2),
              child: Text(model.thirdBottomNews, style: itemTextStyle),
            )),
      ],
    );
  }

  void _itemClicked(NewsListTaped type) {
    print(type);
    widget.itemClicked(type);
  }
}
